<%@ page language="java" import="com.gin.util.*" pageEncoding="UTF-8" %>
 <%@ page language="java" import="java.util.*" %>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 <%@ taglib prefix="ssm" uri="http://ssm" %>
 <%@ include file="/head.jsp" %>


<script src="js/jquery.validate.js"></script>
<script>
    window.searchSelectUrl = "common.do?ac=selectUpdateSearch";
    window.selectUpdateUrl = "common.do?ac=tableAjax";
</script>
<script src="js/selectUpdate.js"></script>

<div>
    <div class="panel panel-default">
        <div class="panel-heading">
            <span class="titles"> 添加试题 </span>
        </div>
        <div class="panel-body">
            <form action="shiti.do?ac=update" method="post" name="form1" id="form1">
                <!-- form 标签开始 -->

                <input type="hidden" name="shijuanid" value="${mmm.shijuanid}" />
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">试卷编号</label>
                        <div class="col-sm-10">${mmm.shijuanbianhao}<input type="hidden" id="shijuanbianhao" name="shijuanbianhao" value="${Info.html(mmm.shijuanbianhao)}" /></div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">试卷名称</label>
                        <div class="col-sm-10">
                            ${mmm.shijuanmingcheng}<input type="hidden" id="shijuanmingcheng" name="shijuanmingcheng" value="${Info.html(mmm.shijuanmingcheng)}" />
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">所属科目</label>
                        <div class="col-sm-10">
                            <ssm:sql var="mapkemu10" type="find">SELECT kemumingcheng,id FROM kemu where id='${mmm.suoshukemu}'</ssm:sql>${mapkemu10.kemumingcheng}<input
                                type="hidden"
                                id="suoshukemu"
                                name="suoshukemu"
                                value="${Info.html(mmm.suoshukemu)}"
                            />
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">课程名称</label>
                        <div class="col-sm-10">
                            ${mmm.kechengmingcheng}<input type="hidden" id="kechengmingcheng" name="kechengmingcheng" value="${Info.html(mmm.kechengmingcheng)}" />
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">章节名称</label>
                        <div class="col-sm-10">
                            ${mmm.zhangjiemingcheng}<input type="hidden" id="zhangjiemingcheng" name="zhangjiemingcheng" value="${Info.html(mmm.zhangjiemingcheng)}" />
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">发布人</label>
                        <div class="col-sm-10">${mmm.faburen}<input type="hidden" id="faburen" name="faburen" value="${Info.html(mmm.faburen)}" /></div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">试题</label>
                        <div class="col-sm-10">
                            <div class="form-inline">
                                <select
                                    class="form-control"
                                    data-fields="timubianhao,biaoti,leixing,nandu,daan"
                                    data-value="${Info.html(mmm.shiti)}"
                                    id="shiti"
                                    name="shiti"
                                    onchange="getAjaxData('tiku',this,this.value)"
                                >
                                    <option value="">请选择试题</option>
                                </select>
                                关键词：<input type="text" class="form-control" id="shiti_keyword" value="" />
                                <select class="form-control class_leixing_search20" data-value="" id="leixing_search" name="leixing_search">
                                    <option value="">请选择</option>
                                    <option value="单选题">单选题</option>
                                    <option value="多选题">多选题</option>
                                    <option value="判断题">判断题</option>
                                </select>
                                <select class="form-control class_nandu_search21" data-value="" id="nandu_search" name="nandu_search">
                                    <option value="">请选择</option>
                                    <option value="难">难</option>
                                    <option value="中">中</option>
                                    <option value="易">易</option>
                                </select>
                                <button type="button" class="btn btn-default" onclick="shiti_select_update()">搜索</button>
                                <script>
                                    function shiti_select_update() {
                                        var keyword = $("#shiti_keyword").val();
                                        var where = {};
                                        if ($("#leixing_search").val() != "") where.leixing = $("#leixing_search").val();
                                        if ($("#nandu_search").val() != "") where.nandu = $("#nandu_search").val();
                                        searchSelect("shiti", "tiku", keyword, where, "timubianhao,biaoti,leixing,nandu,daan".split(","), "".split(","));
                                    }
                                    shiti_select_update();
                                </script>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">题目编号</label>
                        <div class="col-sm-10">
                            <input
                                type="text"
                                class="form-control select-update"
                                placeholder="输入题目编号"
                                style="width: 150px"
                                id="timubianhao"
                                name="timubianhao"
                                value="${Info.html(mmm.timubianhao)}"
                            />
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">标题</label>
                        <div class="col-sm-10">
                            <textarea style="width: 80%; height: 120px" class="form-control select-update" placeholder="输入标题" id="biaoti" name="biaoti">
${Info.html(mmm.biaoti)}</textarea
                            >
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">类型</label>
                        <div class="col-sm-10">
                            <select class="form-control select-update" data-value="${Info.html(mmm.leixing)}" id="leixing" name="leixing" style="width: 250px">
                                <option value="单选题">单选题</option>
                                <option value="多选题">多选题</option>
                                <option value="判断题">判断题</option>
                                <option value="填空题">填空题</option>
                                <option value="简答题">简答题</option>
                            </select>
                            <script>
                                $(".class_leixing22 select-update").val($(".class_leixing22 select-update").attr("data-value"));
                            </script>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">难度</label>
                        <div class="col-sm-10">
                            <select class="form-control select-update" data-value="${Info.html(mmm.nandu)}" id="nandu" name="nandu" style="width: 250px">
                                <option value="难">难</option>
                                <option value="中">中</option>
                                <option value="易">易</option>
                            </select>
                            <script>
                                $(".class_nandu23 select-update").val($(".class_nandu23 select-update").attr("data-value"));
                            </script>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs">答案</label>
                        <div class="col-sm-10">
                            <div id="TypeFieldabc">
                                <div style="border: 1px solid #ededed; border-radius: 5px; padding: 10px; background: #F2F2F2">
                                    <table class="table table-hover">
                                        <thead>
                                            <tr>
                                                <th width="80"> </th>
                                                <th>答案</th>
                                                <!--<th width="80">跳转序号</th>-->
                                                <th width="60">得分</th>
                                            </tr>
                                        </thead>
                                        <tbody id="field_box"></tbody>
                                    </table>
                                </div>
                                <button type="button" class="btn btn-default btn-sm" id="add_btn">增加答案</button>
                            </div>
                            <input type="hidden" id="daan" name="daan" />
                            <script>
                                function selectType(obj)
                                {
                                    var v = $(obj).val();
                                    if(v=='单选题' || v=='多选题'){
                                        $('#TypeFieldabc').show();
                                    }else{
                                        $('#TypeFieldabc').hide();
                                    }
                                }

                                function updateZimu()
                                {
                                    var zimu = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
                                    var index = $("#field_box").find("tr").each(function(index){
                                        $(this).find('td:eq(0)').find('input').val(zimu.substr(index,1));
                                    });
                                }

                                function addFieldItem(wx){
                                    wx=wx||{};
                                    var str = [];
                                    str.push('<tr><td align="center" valign="middle">');
                                    str.push('<input type="text" readonly="readonly" style="width: 40px;" data-id="zimu" class="form-control" value="" />');
                                    str.push('</td><td>');
                                    str.push('<input type="text" style="width:100%" onblur="updateData()" data-id="title" class="form-control" value="'+(wx.title||'')+'" />');
                                    str.push('</td><td>');

                                    str.push('<input type="number" step="1" style="width: 60px;" onblur="updateData()" data-id="point" class="form-control" value="'+(wx.point||'0')+'" />');
                                    str.push('</td><td>');

                                    str.push('<button onclick="delItem(this);" type="button" class="btn btn-default">删除</button>');
                                    str.push('</td></tr>');
                                    var html = str.join('');
                                    $('#field_box').append(html);
                                    updateZimu();
                                }

                                function delItem(obj){
                                    if(confirm('此操作将不可恢复，您确定删除？')){
                                        $(obj).parent().parent().remove();
                                    }
                                    updateZimu();
                                }
                                $(function(){
                                    var __fields = ${mmm.daan};
                                    if(__fields.length>0){
                                        $.each(__fields , function(){
                                            addFieldItem(this);
                                        });
                                    }else{
                                        addFieldItem();
                                    }
                                });

                                function updateData()
                                {
                                    var result = [];
                                    $('#field_box').find('tr').each(function () {
                                        var obj = {};
                                        $(this).find('[data-id]').each(function () {
                                            if($(this).attr('type') == 'checkbox') {
                                                obj[$(this).attr('data-id')] = $(this).attr('checked')
                                            }else{
                                                obj[$(this).attr('data-id')] = $.trim($(this).val());
                                            }
                                        });
                                        if(obj.title != '' && obj.point != ''){
                                            result.push(obj);
                                        }
                                    });
                                    $('#daan').val(JSON.stringify(result));
                                }

                                $('#TypeFieldabc').on('input,checkbox' , 'blur,change' , function (e) {
                                    console.log(e);
                                })

                                $('#add_btn').click(addFieldItem);
                                $('#form1').submit(function () {
                                    updateData();
                                    return true;
                                })
                            </script>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <label style="text-align: right" class="col-sm-2 hiddex-xs"> </label>
                        <div class="col-sm-10">
                            <input name="id" value="${mmm.id}" type="hidden" />
                            <input name="referer" value="<%=request.getHeader("referer") %>" type="hidden" />
                            <input name="updtself" value="${updtself}" type="hidden" />

                            <button type="submit" class="btn btn-primary" name="Submit">提交</button>
                            <button type="reset" class="btn btn-default" name="Submit2">重置</button>
                            <button type="button" class="btn btn-default" onclick="history.back()">返回</button>
                        </div>
                    </div>
                </div>

                <!--form标签结束-->
            </form>

            <script>
                $(function () {
                    $("#form1").validate();
                });
            </script>
        </div>
    </div>
</div>

<%@ include file="/foot.jsp" %>

